import React, { memo } from "react";
import { View } from "@tarojs/components";
import { useSelector } from 'react-redux'
import GainsBar from "../GainsBar"





import './index.scss'

const GainsComparision = (props) => {
  // const { reportDetail = {} } = props
  const { reportDetail } = useSelector(state => state.obsPool)

  const autoHeight = () => {
    let list = reportDetail.otherList
    return list.length * 36 + (list.length - 1) * 12
  }
  return (
    <View className='body-card'>
      <View className='card-name text1 black'>
        <View className='title'> 近一年收益对比</View>
      </View>
      <View className='bar-content' style={{ height: autoHeight() + 'px' }}>
        <GainsBar reportDetail={props.reportDetail} />
      </View>

    </View>




  );
};

export default memo(GainsComparision);
